/**
 * @description  券池审批
 * @author shenhong
 */
import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { TableC } from '../../../comps';
import uuid from 'es6-uuid';

class NetValueTable extends PureComponent {
  constructor() {
    super();
    this.state = {
      disabled: true,
      currentPage: 1,
      numInPage: 10,
    };
  }

  componentDidMount() {
    const { dispatch } = this.props;
  }

  handleChange = (page, pageSize) => {
    this.setState({
      currentPage: page,
      numInPage: pageSize,
    });
  };

  onShowSizeChange = (page, pageSize) => {
    this.setState({
      currentPage: 1,
      numInPage: pageSize,
    });
  };

  changeFlowType = (num) => {
    const text = Number(num)
      .toFixed(4)
      .replace(/(\d)(?=(\d{3})+\.)/g, '$1,');
    return text;
  };

  changeFlowType2 = (num) => {
    const text = Number(num)
      .toFixed(2)
      .replace(/(\d)(?=(\d{3})+\.)/g, '$1,');
    return text;
  };

  changeColumns = (columns) => {
    const newColumns = columns;
    if (newColumns && newColumns.length) {
      newColumns.map((item) => {
        if (item.key == 'tenThousandYield' || item.key == 'netValue' || item.key == 'accuNetValue') {
          item.align = 'right';
          item.render = (text, record) => {
            return this.changeFlowType(text);
          };
        }
        if (item.key == 'annualYield7d') {
          item.align = 'right';
          item.render = (text, record) => {
            return this.changeFlowType2(text);
          };
        }
        if (item.key == 'netAssetValue' || item.key == 'assetUnit') {
          item.type = 'money';
        }
        if (item.key == 'dayChangeRate') {
          item.align = 'right';
          item.render = (text, record) => {
            return this.changeFlowType2(text);
          };
        }
      });
    }
    return newColumns;
  };

  // 展示表格
  showTable = () => {
    const {
      netValueM: { tableData5 },
      loading,
    } = this.props;
    const { columns } = tableData5;
    const dataSource = tableData5.dataSource.map((item) => {
      item.id = uuid(16);
      return item;
    });
    const newColumns = this.changeColumns(tableData5.columns);
    return (
      <div>
        <TableC
          columns={newColumns}
          dataSource={dataSource}
          rowKey='id'
          loading={loading}
          total={dataSource.length || 0}
          current={this.state.currentPage}
          pageSize={this.state.numInPage}
          onPageChange={this.handleChange}
          onShowSizeChange={this.onShowSizeChange}
        />
      </div>
    );
  };

  render() {
    return <div>{this.showTable()}</div>;
  }
}
export default connect(({ netValueM }) => ({
  netValueM,
}))(NetValueTable);
